﻿<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>查询条件设置 </title>
    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">

    <script src="../CCMobile/js/jquery.js" type="text/javascript"></script>
    <!--通用JS-->
    <script src="../CCMobile/Scripts/QueryString.js" type="text/javascript"></script>
    <script src="../CCMobile/Scripts/config.js" type="text/javascript"></script>
    <script src="../CCMobile/Comm/Gener.js" type="text/javascript"></script>

    <link href="../CCMobile/css/index2.css" rel="stylesheet" />
    <link href="../CCMobile/js/mui/css/mui.min.css" rel="stylesheet" />
    <link href="../CCMobile/js/mui/css/mui.dtpicker.css" rel="stylesheet" />
    <link href="../CCMobile/js/mui/css/mui.picker.css" rel="stylesheet" />
    <script src="../CCMobile/js/mui/js/mui.min.js"></script>
    <script src="../CCMobile/js/mui/js/mui.picker.min.js"></script>
    <style>
        html,
        body {
            background-color: #efeff4;
        }

        p {
            text-indent: 22px;
        }

        span.mui-icon {
            font-size: 14px;
            color: #007aff;
            margin-left: -15px;
            padding-right: 10px;
        }

        .mui-off-canvas-right {
            color: #fff;
        }

        .mui-off-canvas-left, .mui-off-canvas-right {
            background-color: white !important;
        }
    </style>
    <script type="text/javascript">
        var tspan = GetQueryString("TSpan");
        var wfstate = GetQueryString("WFState");
        $(function () {
            if (tspan != null && tspan != undefined && tspan != 3)
                $("#TSPan_" + tspan).css("background-color", "#4a9bf3");
            if (wfstate != null && wfstate != undefined && wfstate != "")
                $("#WFState_" + wfstate).css("background-color", "#4a9bf3");

            document.getElementById("DTFrom").addEventListener('tap', function () {
                var dtpicker = new mui.DtPicker({
                    "type": "date",
                });
                dtpicker.show(function (rs) {
                    document.getElementById("DTFrom").value = rs.text;
                })
            }, false);

            document.getElementById("DTTo").addEventListener('tap', function () {
                var dtpicker = new mui.DtPicker({
                    "type": "date",
                });
                dtpicker.show(function (rs) {
                    document.getElementById("DTTo").value = rs.text;
                })
            }, false);

            document.getElementById("BtnOK").addEventListener('tap', function () {
                submit();
            });
            document.getElementById("BtnCancel").addEventListener('tap', function () {
                back();
            });
            document.getElementById("BtnReset").addEventListener('tap', function () {
                resetDate();
            });
        });

        function resetDate() {
            $("[name='TSpan']").css("background", "#F5F5F5");
            $("[name='WFState']").css("background", "#F5F5F5");
            tspan = 3;
            wfstate = "";
            $("#DTFrom").val("");
            $("#DTTo").val("");
        }
        function submit() {
            var dtFrom = $("#DTFrom").val();
            var dtTo = $("#DTTo").val();
            window.location.href = "./Home.htm?DoType=search&TSpan=" + tspan + "&WFState=" + wfstate+"&DTFrom="+dtFrom+"&DTTo="+dtTo;
        }
        function back() {
            window.location.href = "./Home.htm?DoType=search&TSpan=" + tspan + "&WFState=" + wfstate;
        }
        function setTSpan(value) {
            $("[name='TSpan']").css("background", "#F5F5F5");

            if (value == "本周") tspan = 0;
            if (value == "上周") tspan = 1;
            if (value == "上上周") tspan = 2;
            if (value == "全部") tspan = 3;
            $("#TSpan_" + tspan).css("background", "#4a9bf3");

        }
        function setWFState(value) {
            $("#TSpan_" + tspan).css("background", "#4a9bf3");
            $("[name='WFState']").css("background", "#F5F5F5");
            if (value == "草稿") wfstate = "1";
            if (value == "运行中") wfstate = "2";
            if (value == "退回") wfstate = "5";
            if (value == "完成") wfstate = "3";
            if (value == "全部") wfstate = "";
            if (wfstate === "")
                $("#WFState_all").css("background", "#4a9bf3");
            else
                $("#WFState_" + wfstate).css("background", "#4a9bf3");
        }
    </script>
</head>

<body>
    <nav class="mui-bar mui-bar-tab">
        <a class="mui-tab-item" href="javaScript:void()" id="BtnCancel">取消</a>
        <a class="mui-tab-item" href="javaScript:void()" id="BtnReset">重置</a>
        <a class="mui-tab-item" href="javaScript:void()" id="BtnOK">确定</a>
    </nav>
  
    <div class="mui-content mui-scroll-wrapper">
        <!--菜单部分-->
        <div class="mui-scroll">
            <section class="screen">
                <div class="top">筛选</div>
                <div class="hd">
                    <div class="title">时间段</div>
                    <div class="list1">
                        <input class="button" name="TSPan" id="TSPan_3" type="button" value="全部" onclick="setTSpan(this.value)">
                        <input class="button" name="TSPan" id="TSPan_0" type="button" value="本周" onclick="setTSpan(this.value)">
                        <input class="button" name="TSPan" id="TSPan_1" type="button" value="上周" onclick="setTSpan(this.value)">
                        <input class="button" name="TSPan" id="TSPan_2" type="button" value="上上周" onclick="setTSpan(this.value)">
                    </div>
                </div>

                <div class="bd">
                    <div class="title">流程状态</div>
                    <div class="list1">
                        <input class="button" name="WFState" id="WFState_all" type="button" value="全部" onclick="setWFState(this.value)">
                        <input class="button" name="WFState" id="WFState_1" type="button" value="草稿" onclick="setWFState(this.value)">
                        <input class="button" name="WFState" id="WFState_2" type="button" value="运行中" onclick="setWFState(this.value)">
                        <input class="button" name="WFState" id="WFState_3" type="button" value="完成" onclick="setWFState(this.value)">
                        <input class="button" name="WFState" id="WFState_5" type="button" value="退回" onclick="setWFState(this.value)">
                    </div>

                    <div class="title" style="padding-top:4%;">申请时间</div>
                    <div class="j">
                        <input class="txt"  type="button" id="DTFrom">
                        <input class="txt"  type="button" id="DTTo">
                        <div class="line"></div>
                    </div>

                </div>
            </section>


        </div>

    </div>


</body>

</html>